<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">
<body>
	<ui:composition template="/templates/template.xhtml">
		<ui:define name="title">Registrar Movimientos</ui:define>
		<ui:define name="body">
			<h:form id="moviForm" prependId="false">
				<rich:panel columns="4">
					<f:facet name="header">
						<h:outputText value="Ingreso de movimiento de caja" />
					</f:facet>

					<h:panelGrid columns="1">
						<h:outputText value="Movimientos para la filial:" />
						<h:selectOneMenu id="zonamovimientos"
							value="#{adminMovimientosBean.codZonaActual}">

							<f:selectItem
								itemValue="#{adminMovimientosBean.usuarioLogueado.zonaSeleccionada.codigo}"
								itemLabel="#{adminMovimientosBean.usuarioLogueado.zonaSeleccionada.nombre}" />
							<f:selectItems value="#{adminMovimientosBean.zonasAsociadas}"
								var="zonaAsoc" itemLabel="#{zonaAsoc.nombre}"
								itemValue="#{zonaAsoc.codigo}" />
						</h:selectOneMenu>

					</h:panelGrid>

					<h:panelGrid columns="4">
						<h:panelGrid columns="1" >
							<h:outputText value="Fecha de movimiento:" />
							<rich:calendar value="#{adminMovimientosBean.fecha}"
								id="calendario" locale="ES" popup="true"
								datePattern="dd/MM/yyyy" showApplyButton="false" required="true"
								requiredMessage="La fecha es requerida.">
							</rich:calendar>
						</h:panelGrid>

						<h:panelGrid columns="1">
							<h:outputText value="Tipo de operación:" />
							<h:selectOneRadio value="#{adminMovimientosBean.tipoOpSelec}"
								valueChangeListener="#{adminMovimientosBean.tipoOperacionChanged}">
								<a4j:ajax event="click" render="cuentas,panelNroFactura" />
								<f:selectItems value="#{adminMovimientosBean.tipoOperaciones}"
									var="tipoOper" itemLabel="#{tipoOper.descripcion}"
									itemValue="#{tipoOper.codigo}" />
							</h:selectOneRadio>
						</h:panelGrid>

						<h:panelGrid columns="1">
							<h:outputText value="Cuenta:" />
							<h:selectOneMenu id="cuentas"
								value="#{adminMovimientosBean.cuentaSelec}">
								<f:selectItems value="#{adminMovimientosBean.cuentas}"
									var="cuenta" itemLabel="#{cuenta.descripcion}"
									itemValue="#{cuenta.codigo}" />
							</h:selectOneMenu>
						</h:panelGrid>

						<h:panelGrid columns="2">
							<h:panelGrid columns="1">
								<h:outputText value="Importe:" />
								<h:inputText value="#{adminMovimientosBean.importe}"
									label="Importe" style="width:60px" required="true"
									requiredMessage="El importe es requerido.">
									<f:validateLongRange minimum="-1000000" maximum="1000000"></f:validateLongRange>
								</h:inputText>
							</h:panelGrid>
							Usar el punto (.) para ingresar cifras con decimales. Ejemplo: 780.90, 56.90, etc.
						</h:panelGrid>
					</h:panelGrid>

					<h:panelGrid columns="3" id="panelNroFactura" >
						<h:panelGrid>
							<h:outputText value="Tipo de Comprobante:"
								rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" />
							<h:selectOneMenu
								rendered="#{adminMovimientosBean.tipoOpSelec eq 2}"
								value="#{adminMovimientosBean.tipoFactura}">
								<f:selectItems value="#{adminMovimientosBean.tiposFacturas}" />
							</h:selectOneMenu>
						</h:panelGrid>

						<h:panelGrid>
							<h:outputText value="Nro. Comprobante:"
								rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" />
							<h:panelGroup colums="3">
								<h:inputText value="#{adminMovimientosBean.nroFactura1}"
									label="Nro. Comprobante" style="width:25px"  id="nroFac1"
									rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" maxlength="4" onblur="completeInput(this,4)" />
								<h:outputText value=" - "
									rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" />
								<h:inputText value="#{adminMovimientosBean.nroFactura2}"
									label="Nro. Comprobante" style="width:50px"  id="nroFac2" 
									rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" maxlength="8" onblur="completeInput(this,8)"/>
							</h:panelGroup>
						</h:panelGrid>

						<h:panelGrid>
							<h:outputText value="CUIT:"
								rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" />
							<h:inputText value="#{adminMovimientosBean.cuit}"
								label="CUIT del Vendedor"
								rendered="#{adminMovimientosBean.tipoOpSelec eq 2}" size="11"
								maxlength="11">
								<f:validator
									validatorId="com.asambleacristiana.utils.CuitValidator" />
							</h:inputText>
						</h:panelGrid>
					</h:panelGrid>

					<h:panelGrid columns="1">
						<h:panelGrid columns="1">
							<h:outputText value="Detalle:" />
							<rich:autocomplete mode="lazyClient" minChars="3"
								value="#{adminMovimientosBean.detalle}" 
								autocompleteList="#{adminMovimientosBean.detalles}" />
						</h:panelGrid>
					</h:panelGrid>
					
					<h:panelGrid>
						<a4j:commandButton
						value="Agregar Movimiento" 
						action="#{adminMovimientosBean.doAgregarMovimiento}"
						render="tablaMov,datascrollMov,mensajes,botonConfirmar"
						id="botonAgregar"/>
					</h:panelGrid>
						
					<h:messages errorStyle="color:red" id="mensajes" />

					<h:panelGrid>
					<h:panelGrid>
					<rich:dataTable value="#{adminMovimientosBean.movimientos}"
						var="movimiento" id="tablaMov" rows="4" rowKeyVar="row" border="0"
						cellpadding="4" cellspacing="0" rules="all">

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Filial" />
							</f:facet>
							<h:outputText value="#{movimiento.zona.nombre}" />
						</rich:column>

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Fecha" />
							</f:facet>
							<h:outputText value="#{movimiento.fecha}">

								<f:convertDateTime pattern="dd/MM/yyyy" />
							</h:outputText>
						</rich:column>


						<rich:column>
							<f:facet name="header">
								<h:outputText value="Operación" />
							</f:facet>
							<h:outputText value="#{movimiento.tipoOperacion.descripcion}" />
						</rich:column>
						
						<rich:column>
							<f:facet name="header">
								<h:outputText value="Cuenta origen" />
							</f:facet>
							<h:outputText value="#{movimiento.desde.descripcion}" />
						</rich:column>
						<rich:column>
							<f:facet name="header">
								<h:outputText value="Cuenta destino" />
							</f:facet>
							<h:outputText value="#{movimiento.hasta.descripcion}" />
						</rich:column>

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Detalle" />
							</f:facet>
							<h:outputText value="#{movimiento.detalle}" />
						</rich:column>


						<rich:column>
							<f:facet name="header">
								<h:outputText value="Tipo" />
							</f:facet>
							<h:outputText value="#{movimiento.tipoFactura.tipo}" />
						</rich:column>

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Nro. Comprobante" />
							</f:facet>
							<h:outputText value="#{movimiento.nroFactura}" />
						</rich:column>

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Vendedor" />
							</f:facet>
							<h:outputText value="#{movimiento.nroCuit}" />
						</rich:column>

						<rich:column>
							<f:facet name="header">
								<h:outputText value="Importe" />
							</f:facet>

							<h:outputText value="#{movimiento.importe}">
								<f:convertNumber currencySymbol="$" type="currency" />
							</h:outputText>

						</rich:column>
						<rich:column>
							<f:facet name="header">
								<h:outputText value="Acciones" />
							</f:facet>
							<a4j:commandButton value="Borrar"
								action="#{adminMovimientosBean.doBorrar}"
								render="tablaMov,datascrollMov,botonConfirmar,mensajes">
								<f:setPropertyActionListener value="#{row}"
									target="#{adminMovimientosBean.movimientoIndex}" />
							</a4j:commandButton>
						</rich:column>
					</rich:dataTable>
					</h:panelGrid>
					</h:panelGrid>
					
					<h:panelGrid columns="3">
					<rich:dataScroller id="datascrollMov" for="tablaMov" maxPages="10" />
					<a4j:commandButton value="Confirmar movimientos"
						disabled="#{!adminMovimientosBean.botonConfirmarHabilitado}"
						onclick="#{rich:component('confirmacion')}.show();return false"
						id="botonConfirmar" />
					</h:panelGrid>
					
					<a4j:jsFunction name="submitConfirmarMovimientos"
						action="#{adminMovimientosBean.doConfirmarMovimientos}"
						render="tablaMov,botonConfirmar,datascrollMov,mensajes" />
						
					<rich:popupPanel id="confirmacion" width="280" height="120">
						<f:facet name="header">Confirmación</f:facet>
						<h:panelGrid>

							<h:outputText
								value="¿Confirma los siguientes movimientos ingresados?" />

							<h:panelGroup>
								<input type="button" value="Aceptar"
									onclick="#{rich:component('confirmacion')}.hide();submitConfirmarMovimientos();return false" />
								<input type="button" value="Cancelar"
									onclick="#{rich:component('confirmacion')}.hide();return false" />
							</h:panelGroup>
						</h:panelGrid>
					</rich:popupPanel>
				</rich:panel>
			</h:form>

			<f:verbatim>
				<script language="javascript">//<![CDATA[
					function completeInput(obj,i) {
					  while (obj.value.length > 0 && obj.value.length<i){
					    obj.value = '0'+obj.value;
					  }
					}
				//]]></script>
			</f:verbatim>
		</ui:define>
	</ui:composition>

</body>




</html>
